<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="commons/template_head::head('Home')">

</head>
<body>

<!-- begin::preloader-->
<div th:replace="commons/layout::preloader">

</div>
<!-- end::preloader -->

<!-- begin::navigation -->
<div th:replace="commons/layout::navigation">

</div>
<!-- end::navigation -->

<!-- begin::main -->
<div id="main">

    <!-- begin::header -->
    <div th:replace="commons/layout::main_header">

    </div>
    <!-- end::header -->

    <!-- begin::main-content -->
    <div class="main-content bg-info-bright" style="background-color: #e0ffff!important;">

        <!-- begin::container -->
        <div class="container">

            <div class="row">
                <div class="col-md-12">

                    <div class="row">
                        <div class="col-md-4">
                            <div class="card">
                                <div class="card-body">
                                    <h6 class="card-title d-flex align-items-start justify-content-between mb-0">
                                        <span>存款产品购买率</span>
                                        <span class="avatar">
                                            <span class="avatar-title bg-success text-white rounded-circle">
                                                <i class="fa fa-percent"></i>
                                            </span>
                                        </span>
                                    </h6>
                                    <div class="d-flex d-sm-block d-lg-flex align-items-end mb-3">
                                        <h3 class="mb-0 mr-2">0.19%</h3>
                                        <p class="small text-muted mb-0 line-height-20">
                                            <span class="text-success">+ 1.2%</span> 与上周比
                                        </p>
                                    </div>
                                    <canvas id="widget-chart1"></canvas>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="card">
                                <div class="card-body">
                                    <h6 class="card-title d-flex align-items-start justify-content-between mb-0">
                                        <span>理财产品购买率</span>
                                        <span class="avatar">
                                            <span class="avatar-title bg-warning text-white rounded-circle">
                                                <i class="fa fa-dollar"></i>
                                            </span>
                                        </span>
                                    </h6>
                                    <div class="d-flex d-sm-block d-lg-flex align-items-end mb-3">
                                        <h3 class="mb-0 mr-2">3,137</h3>
                                        <p class="small text-muted mb-0 line-height-20">
                                            <span class="text-success">+1.2%</span> 与上周比
                                        </p>
                                    </div>
                                    <canvas id="widget-chart2"></canvas>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="card">
                                <div class="card-body">
                                    <h6 class="card-title d-flex align-items-start justify-content-between mb-0">
                                        <span>新客户注册率</span>
                                        <span class="avatar">
                                            <span class="avatar-title bg-danger text-white rounded-circle">
                                                <i class="fa fa-cube"></i>
                                            </span>
                                        </span>
                                    </h6>
                                    <div class="d-flex d-sm-block d-lg-flex align-items-end mb-3">
                                        <h3 class="mb-0 mr-2">1,650</h3>
                                        <p class="small text-muted mb-0 line-height-20">
                                            <span class="text-success">+ 2.1%</span> 与上周比
                                        </p>
                                    </div>
                                    <canvas id="widget-chart3"></canvas>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-8">
                            <div class="card">
                                <div class="card-body">
                                    <h6 class="card-title d-flex justify-content-between">
                                        <span>各存款产品交易量</span>
                                        <span class="dropdown">
                                            <a href="#" data-toggle="dropdown" aria-haspopup="true"
                                               aria-expanded="false">
                                                <i class="fa fa-ellipsis-v" aria-hidden="true"></i>
                                            </a>
                                            <span class="dropdown-menu dropdown-menu-right">
                                                <a href="#" class="dropdown-item">属性1</a>
                                                <a href="#" class="dropdown-item">属性2</a>
                                                <a href="#" class="dropdown-item">其他属性</a>
                                            </span>
                                        </span>
                                    </h6>
                                    <div id="chart1"></div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="card">
                                <div class="card-body">
                                    <h6 class="card-title">产品总交易数</h6>
                                    <div class="text-center">
                                        <div class="mb-2">
                                            <span class="bar-1">2,5,9,6,5,2,4,3,7,5</span>
                                        </div>
                                        <div class="font-size-30 mb-1 font-weight-bold text-primary">1.241</div>
                                        <p class="mb-0 text-muted">
                                            <i class="fa fa-caret-up text-primary m-r-5"></i> 比上周增加了10%
                                        </p>
                                    </div>
                                </div>
                            </div>
                            <div class="card">
                                <div class="card-body">
                                    <h6 class="card-title">产品平均收益</h6>
                                    <div class="text-center">
                                        <div class="mb-2">
                                            <span class="bar-3">2,5,9,6,5,2,4,3,7,5</span>
                                        </div>
                                        <div class="font-size-30 mb-1 font-weight-bold text-success">$732.52</div>
                                        <p class="mb-0 text-muted">
                                            <i class="fa fa-caret-down text-danger m-r-5"></i> 比上周增加了5%
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>

        </div>
        <!-- end::container -->

    </div>
    <!-- end::main-content -->

    <!-- begin::footer -->
    <footer th:replace="commons/layout::main_footer">

    </footer>
    <!-- end::footer -->

</div>
<!-- end::main -->

<div th:replace="commons/layout::end">

</div>

</body>
</html>


